<html>
	<head>	
      <title>NEW ERA HPC</title>
      <link rel="stylesheet" href="assets/css/reset.css" />
      <link rel="stylesheet" href="assets/css/desktop.css" />
	
      <script type="text/javascript">
      
         function getBaseURL() 
         {
            var url = location.href;  // entire url including querystring - also: window.location.href;
            var baseURL = url.substring(0, url.indexOf('/', 14));

            return baseURL + "/";
         }	 

         function jsonPath()
         {
            xml_path = window.location.pathname + ".json";
            return xml_path;
         }

			function launch_application(app_path)
         {
				app_path_ui = "/app/" + app_path + ".json";
					
            $.ajax({url:app_path_ui, success:function(responseText,textStatus,xhR)
            {
               getResponse(app_path_ui);
            }});
			}
      </script>


      <script type="text/javascript">

			var getResponse = function(json_path){
				$.getJSON(json_path,function(items){
					if(items.app_attributes.type == "window")
					{
                  var id = "window_" + items.appname;
						alert(id);
						var e = $('<div id=\"window_calculator\" class=\"abs window\"></div>');
						$('#desktop').append(e);
						$('#window_calculator').addClass('window_stack').show();
					}
				});
			};

      </script>
   </head>

   <body>
      <div class="abs" id="wrapper">
         <div class="abs" id="desktop">
            <a class="abs icon" style="left:20px;top:20px;" href="#icon_dock_computer">
               <img src="assets/images/icons/icon_32_computer.png" />
               Computer
            </a>
            <a class="abs icon" style="left:20px;top:100px;" href="#icon_dock_drive">
               <img src="assets/images/icons/icon_32_drive.png" />
               Hard Drive
            </a>
            <a class="abs icon" style="left:20px;top:180px;" href="#icon_dock_disc">
               <img src="assets/images/icons/icon_32_disc.png" />
               Audio CD
            </a>
            <a class="abs icon" style="left:20px;top:260px;" href="#icon_dock_network">
               <img src="assets/images/icons/icon_32_network.png" />
               Network
            </a>
            <a class="abs icon" style="left:20px;top:340px;" href="#icon_dock_Calculator">
               <img src="assets/images/icons/icon_32_network.png" />
               Calculator
            </a>
            
				<!--
				<comment>
            <div id="window_calculator" class="abs window">
					<div class="abs window_inner">
                  <div class="window_top">
                     <span class="float_left">
                        <img src="assets/images/icons/icon_16_computer.png" />
                        Calculator
                     </span>
                     <span class="float_right">
                        <a href="#" class="window_min"></a>
                        <a href="#" class="window_resize"></a>
                        <a href="#icon_dock_calculator" class="window_close"></a>
                     </span>
                  </div>
					</div>
            </div>
            </comment>
				-->
				
            <div id="window_computer" class="abs window">
               <div class="abs window_inner">
                  <div class="window_top">
                     <span class="float_left">
                        <img src="assets/images/icons/icon_16_computer.png" />
                        Computer
                     </span>
                     <span class="float_right">
                        <a href="#" class="window_min"></a>
                        <a href="#" class="window_resize"></a>
                        <a href="#icon_dock_computer" class="window_close"></a>
                     </span>
                  </div>
                  <div class="abs window_content">
                     <div class="window_aside">
                        Hello. You look nice today!
                     </div>
                     <div class="window_main">
                        <table class="data">
                           <thead>
                              <tr>
                                 <th class="shrink">
                                    &nbsp;
                                 </th>
                                 <th>
                                    Name
                                 </th>
                                 <th>
                                    Date Modified
                                 </th>
                                 <th>
                                    Date Created
                                 </th>
                                 <th>
                                    Size
                                 </th>
                                 <th>
                                    Kind
                                 </th>
                              </tr>
                           </thead>
                           <tbody>
                              <tr>
                                 <td>
                                    <img src="assets/images/icons/icon_16_drive.png" />
                                 </td>
                                 <td>
                                    Hard Drive
                                 </td>
                                 <td>
                                    Today
                                 </td>
                                 <td>
                                    &mdash;
                                 </td>
                                 <td>
                                    200 GB
                                 </td>
                                 <td>
                                    Volume
                                 </td>
                              </tr>
                           </tbody>
                        </table>
                     </div>
                  </div>
                  <div class="abs window_bottom">
                     Build: TK421
                  </div>
               </div>
					<span class="abs ui-resizable-handle ui-resizable-se"></span>
            </div>
            
            <div id="window_drive" class="abs window">
               <div class="abs window_inner">
                  <div class="window_top">
                     <span class="float_left">
                        <img src="assets/images/icons/icon_16_drive.png" />
                        Hard Drive
                     </span>
                     <span class="float_right">
                        <a href="#" class="window_min"></a>
                        <a href="#" class="window_resize"></a>
                        <a href="#icon_dock_drive" class="window_close"></a>
                     </span>
                  </div>
                  <div class="abs window_content">
                     <div class="window_aside">
                        Storage in use: 119.1 GB
                     </div>
                     <div class="window_main">
                        <table class="data">
                           <thead>
                              <tr>
                                 <th class="shrink">
                                    &nbsp;
                                 </th>
                                 <th>
                                    Name
                                 </th>
                                 <th>
                                    Date Modified
                                 </th>
                                 <th>
                                    Date Created
                                 </th>
                                 <th>
                                    Size
                                 </th>
                                 <th>
                                    Kind
                                 </th>
                              </tr>
                           </thead>
                           <tbody>
                              <tr>
                                 <td>
                                    <img src="assets/images/icons/icon_16_page.png" />
                                 </td>
                                 <td>
                                    .DS_Store
                                 </td>
                                 <td>
                                    Yesterday
                                 </td> 
                                 <td>
                                    &mdash;
                                 </td>
                                 <td>
                                    6 KB
                                 </td>
                                 <td>
                                    Hidden
                                 </td>
                              </tr>
                           </tbody>
                        </table>
                     </div>
                  </div>
						<div class="abs window_bottom">
							Free: 80.9 GB
						</div>
					</div>
					<span class="abs ui-resizable-handle ui-resizable-se"></span>
				</div>

				<div id="window_disc" class="abs window">
					<div class="abs window_inner">
						<div class="window_top">
							<span class="float_left">
								<img src="assets/images/icons/icon_16_disc.png" />
								Audio CD - Title of Album
							</span>
							<span class="float_right">
								<a href="#" class="window_min"></a>
								<a href="#" class="window_resize"></a>
								<a href="#icon_dock_disc" class="window_close"></a>
							</span>
						</div>
						<div class="abs window_content">
							<div class="window_aside align_center">
								<img src="assets/images/misc/album_cover.jpg" />
								<br />
								<em>Title of Album</em>
							</div>
							<div class="window_main">
								<table class="data">
									<thead>
										<tr>
											<th class="shrink">
												&nbsp;
											</th>
											<th class="shrink">
												Track
											</th>
											<th>
												Song Name
											</th>
											<th class="shrink">
												Length
											</th>
										</tr>
									</thead>
									<tbody>
										<tr>
											<td>
												<img src="assets/images/icons/icon_16_music.png" />
											</td>
											<td class="align_center">
												01
											</td>
											<td>
												Track One
											</td>
											<td class="align_right">
												3:50
											</td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>
						<div class="abs window_bottom">
							Genre: Rock/Rap
						</div>
					</div>
					<span class="abs ui-resizable-handle ui-resizable-se"></span>
				</div>


				<div id="window_network" class="abs window">
					<div class="abs window_inner">
						<div class="window_top">
							<span class="float_left">
								<img src="assets/images/icons/icon_16_network.png" />
								Network
							</span>
							<span class="float_right">
								<a href="#" class="window_min"></a>
								<a href="#"	class="window_resize"></a>
								<a href="#icon_dock_network" class="window_close"></a>
							</span>
						</div>
						<div class="abs window_content">
							<div class="window_aside">
								Local Network Resources
							</div>
							<div class="window_main">
								<table class="data">
									<thead>
										<tr>
											<th class="shrink">
												&nbsp;
											</th>
											<th>
												Name
											</th>
											<th class="shrink">
												Operating System
											</th>
											<th class="shrink">
												Version
											</th>
										</tr>
									</thead>
									<tbody>
										<tr>
											<td>
												<img src="assets/images/icons/icon_16_server.png" />
											</td>
											<td>
												Urban Terror - <em>Game Server</em>
											</td>
											<td>
												Linux
											</td>
											<td>
												Ubuntu
											</td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>
						<div class="abs window_bottom">
							LAN: Corporate Intranet
						</div>
					</div>
					<span class="abs ui-resizable-handle ui-resizable-se"></span>
				</div>
				
				
			</div>
			<!-- desktop division ends here -->
  
  
			<div class="abs" id="bar_top">
				<span class="float_right" id="clock"></span>
				<ul>
					<li>
						<a class="menu_trigger" href="#">jQuery Desktop</a>
							<ul class="menu">
								<li>
									<a href="http://www.amazon.com/dp/0596159773?tag=sons-20">jQuery Cookbook</a>
								</li>
							</ul>
					</li>
					<li>
						<a class="menu_trigger" href="#">HTML5 Resources</a>
							<ul class="menu">
								<li>
									<a href="http://diveintohtml5.info/">Dive Into HTML5</a>
								</li>
							</ul>
					</li>
				</ul>
			</div>
			
			<div class="abs" id="bar_bottom">
				<a class="float_left" href="#" id="show_desktop" title="Show Desktop">
					<img src="assets/images/icons/icon_22_desktop.png" />
				</a>
				<ul id="dock">
					<li id="icon_dock_computer">
						<a href="#window_computer">
							<img src="assets/images/icons/icon_22_computer.png" />
							Computer
						</a>
					</li>
					<li id="icon_dock_drive">
						<a href="#window_drive">
							<img src="assets/images/icons/icon_22_drive.png" />
							Hard Drive
						</a>
					</li>
					<li id="icon_dock_disc">
						<a href="#window_disc">
							<img src="assets/images/icons/icon_22_disc.png" />
							Audio CD
						</a>
					</li>
					<li id="icon_dock_network">
						<a href="#window_network">
							<img src="assets/images/icons/icon_22_network.png" />
							Network
						</a>
					</li>
					<li id="icon_dock_Calculator">
						<a href="#window_calculator">
							<img src="assets/images/icons/icon_22_network.png" />
							Calculator
						</a>
					</li>
				</ul>
				<a class="float_right" href="http://www.firehost.com/?ref=spon_nsmith_desktop-sonspring" title="Secure Hosting">
					<img src="assets/images/misc/firehost.png" />
				</a>
			</div>
		
		</div>
		
		
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
		<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
		<script>
			!window.jQuery && document.write(unescape('%3Cscript src="assets/js/jquery.js"%3E%3C/script%3E'));
			!window.jQuery.ui && document.write(unescape('%3Cscript src="assets/js/jquery.ui.js"%3E%3C/script%3E'));
		</script>
		<script src="assets/js/jquery.desktop.js"></script>
		<script>
			var _gaq = [['_setAccount', 'UA-166674-8'], ['_trackPageview']];

			(function(d, t) {
				var g = d.createElement(t),
				s = d.getElementsByTagName(t)[0];
				g.async = true;
				g.src = '//www.google-analytics.com/ga.js';
				s.parentNode.insertBefore(g, s);
			})(this.document, 'script');
		</script>
	</body>
</html>